<!--分类表单组件-->
<template>
  <a-form-item label="类型" v-bind="validateInfos.category_id">
    <a-radio-group v-model:value="state.category_id">
      <a-radio :value="item.id" v-for="item of cateGoryData">{{ item.name }}</a-radio>
    </a-radio-group>
  </a-form-item>
</template>
<script setup lang="ts">
import {onMounted, ref, watchEffect} from "vue";
import {dictDetail} from "@/api/api";
import {AxiosResponse} from "axios";
import {message} from "ant-design-vue";
import {useRoute} from "vue-router";

// id可能为当前字典分类id，获取文献或者文章详情id，需要拿到文献或者文章详情中的type_id再去请求字典接口，拿到id
const props = defineProps(["validateInfos", "state", "id", "typeId"]);

// 分类
const cateGoryData = ref<Array<{ id: string, name: string }>>([]);
const route = useRoute();
const isUpdate = route.path.indexOf("update") >= 0;

// 监听typeId的变化
watchEffect(() => {
  // 如果是更新页面，直接拿id，反之等待父组件异步获取详情接口后，拿到type_id，再请求
  if (!isUpdate || props.typeId) {
    dictDetail(isUpdate ? props.typeId : props.id as string).then((r: AxiosResponse) => {
      cateGoryData.value = r.data.data.data;
    }, err => message.error(err))
  }
})
</script>